import React, { FC, useMemo } from 'react';
import { Menu, Dropdown, Icon, Button } from 'choerodon-ui/pro';

export interface DropdownBasicProps {}

const DropdownBasic: FC<DropdownBasicProps> = () => {
  const menu = useMemo(() => {
    return (
      <Menu>
        <Menu.Item>
          <a target="_blank" rel="noopener noreferrer" href="https://choerodon.io">
            1st menu item
          </a>
        </Menu.Item>
        <Menu.Item>
          <a target="_blank" rel="noopener noreferrer" href="https://choerodon.io">
            2nd menu item
          </a>
        </Menu.Item>
        <Menu.Item>
          <a target="_blank" rel="noopener noreferrer" href="https://choerodon.io">
            3rd menu item
          </a>
        </Menu.Item>
      </Menu>
    );
  }, []);
  return (
    <div>
      <Dropdown overlay={menu}>
        <Button>
          下拉菜单 <Icon type="arrow_drop_down" />
        </Button>
      </Dropdown>
    </div>
  );
};

export default DropdownBasic;
